<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>重点关注场景</title>
    <link rel="stylesheet" href="../../../assert/css/font.css" th:href="@{/assert/css/font.css}"/>
    <link rel="stylesheet" href="../../../assert/css/bootstrap.min.css" th:href="@{/assert/css/bootstrap.min.css}"/>
    <link rel="stylesheet" href="../../../assert/css/plugin/chosen/chosen.css"
          th:href="@{/assert/css/plugin/chosen/chosen.css}"/>
    <link rel="stylesheet" href="../../../assert/css/bootstrap-table.css" th:href="@{/assert/css/bootstrap-table.css}"/>
    <link rel="stylesheet" href="../../../assert/css/bootstrap-select.min.css"
          th:href="@{/assert/css/bootstrap-select.min.css}"/>
    <link href="../../../assert/css/animate.min.css" rel="stylesheet" th:href="@{/assert/css/animate.min.css}">
    <link href="../../../assert/css/plugin/toastr/toastr.min.css" rel="stylesheet"
          th:href="@{/assert/css/plugin/toastr/toastr.min.css}">
    <link href="../../../assert/css/plugin/jsTree/themes/default/style.css" rel="stylesheet"
          th:href="@{/assert/css/plugin/jsTree/themes/default/style.css}">
    <link href="../../../assert/css/loaders.css" rel="stylesheet"
          th:href="@{/assert/css/loaders.css}">
    <link rel="stylesheet" href="../../../assert/css/city-picker.css" th:href="@{/assert/css/city-picker.css}"/>
    <link rel="stylesheet" href="../../../assert/css/jquery-ui.css" th:href="@{/assert/css/jquery-ui.css}"/>
    <link rel="stylesheet" href="../../../assert/css/index.css" th:href="@{/assert/css/index.css(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"/>

    <style>
        .search_group label.control-label {
            width: 85px;
        }
        .tabs{
            overflow: hidden;
            margin-bottom: 10px;
        }
        .tabs li{
            float: left;
            margin: 0 .5em 0 0;
        }
        .tabs li a{
            position: relative;
            padding:9px 40px;
            background: #ddd;
            background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#ddd));
            float: left;
            text-decoration: none;
            color: #444;
            -webkit-border-radius: 5px 0 0 0;
            -moz-border-radius: 5px 0 0 0;
            border-radius: 5px 0 0 0;
            -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.4);
            box-shadow: 0 2px 2px rgba(0,0,0,.4)
        }
        .tabs a::after{
            content: '';
            position: absolute;
            z-index: 1;
            top: 0;
            right: -.5em;
            bottom: 0;
            width: 1em;
            background: #ddd;
            background-image: linear-gradient(to bottom,#fff,#ddd);
            -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,.4);
            box-shadow: 2px 2px 2px rgba(0,0,0,.4);
            -webkit-transform: skew(10deg);
            -moz-transform: skew(10deg);
            -ms-transform: skew(10deg);
            -o-transform: skew(10deg);
            transform: skew(10deg);
            -webkit-border-radius: 0 5px 0 0;
            -moz-border-radius: 0 5px 0 0;
            border-radius: 0 5px 0 0;
        }
        .tabs li.on a{
            background: #337ab7;
            color:#fff;
        }
        .tabs li.on a:after{
            background: #337ab7;
        }
        .contents>li{
            display: none;
            position: absolute;
            background: #fff;
            z-index: 10;
            width:100%;
        }
        .contents>li.on{
            display: inline-block;
        }
        #initTip{
            /*position: absolute;*/
            /*top: 142px;*/
            width: 100%;
            height:540px;
            background: #fff;
        }
        #initTip p{
            height: 200px;
            line-height: 200px;
            border: 1px solid #ddd;
        }
    </style>
</head>
<body>
<!--添加业务分类/场景模态框-->
<div class="modal fade" id="workModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-flag="2">
    <div class="modal-dialog" style="width: 1000px;">
        <div class="modal-content">
            <div>
                <div class="modal-header">
                    <button type="button" class="close closeAudioModel" data-dismiss="modal"><span
                            aria-hidden="true">&times;</span><span
                            class="sr-only">Close</span></button>
                    <h4 class="modal-title">选择业务分类/场景</h4>
                </div>
                <div class="modal-body">
                    <div class="selectModel" style="height:570px !important;">
                        <div class="menu_left">
                            <div class="search_box">
                                <input type="text" autocomplete="off"><span class="fa fa-search fa_btn"
                                                                            id="searchMenuWork"></span>
                            </div>
                            <div id="jstree" class="scrollbar" style="height:520px;">

                            </div>
                        </div>
                        <div class="model_right" style="width:480px;height: 100%;">
                            <!--                            <div class="search_box">-->
                            <!--                                <input type="text" autocomplete="off" placeholder="业务分类名称" style="width: 450px;" id="tagTreeName"><span-->
                            <!--                                    class="fa fa-search fa_btn" id="searchworkName"></span>-->
                            <!--                            </div>-->
                            <table id="workTableWin"></table>
                        </div>
                        <div class="model_right" style="width: 270px;height: 546px;">
                            <div class="tagSModel" id="workSModel">
                                <div>已选业务分类/场景：</div>
                                <ul style="overflow: auto;height: 556px;">
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="saveWork">保存</button>
                    <button type="button" class="btn btn-white closeAudioModel" data-dismiss="modal" id="closeWork">关闭</button>
                </div>
            </div>
        </div>
    </div>
</div>

<a id="basePath" th:href="@{/}"></a>
<div class="wrapper wrapper-content">
    <div class="ibox">
        <ul class="tabs">
            <li class="on"><a href="javascript:;">场景排行</a></li>
            <li><a href="javascript:;">趋势分析</a></li>
        </ul>
        <ul class="contents">
            <li class="scene_box on">
                <!--全局功能按钮-->
                <div class="tools_bar">
                    <div class="pull-left">
                        <a href="#" class="btn btn-default active" id="btnSearch" title="隐藏查询条"><i class="fa fa-filter"></i> 隐藏</a>
                        <a href="#" class="btn btn-default active" id="refresh"><i class="fa fa-refresh"></i> 刷新</a>
                    </div>
                </div>
                <!--查询条-->
                <div class="search on" id="searchBox">
                    <div class="search_group">
                        <label class="control-label"><span class="respan">*</span>日期：</label>
                        <div class="control-inline">
                            <input placeholder="开始日期" class="form-control layer-date search_input" id="callStartTime" autocomplete="off"> -
                            <input placeholder="结束日期" class="form-control layer-date search_input" id="callEndTime" autocomplete="off">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label"><span class="respan">*</span>省市：</label>
                        <div class="control-inline" style="position: relative;">
                            <input id="city" class="form-control city" readonly type="text" value="" autocomplete="off">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">满意度：</label>
                        <div class="control-inline">
                            <select type="text" id="agree" value="" class="form-control search_input agree"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">重复来电：</label>
                        <div class="control-inline">
                            <select type="text" id="repeatPhone" value="" class="form-control search_input repeatPhone"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">客户星级：</label>
                        <div class="control-inline">
                            <select type="text" id="customerLevel"  class="form-control search_input selectpicker" title="请选择"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">话务小结：</label>
                        <div class="control-inline">
                            <input type="text" id="tagTrafficSearch0" value="" class="form-control search_input tagName" autocomplete="off"  data-type="0">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">系统标签：</label>
                        <div class="control-inline">
                            <input type="text" id="tagTrafficSearch1" value="" class="form-control search_input tagName" autocomplete="off" data-type="1">
                        </div>
                    </div>
                    <div class="search_group">
                        <button id="search" class="btn  btn-primary">查询</button>
                        <button id="reset" class="btn  btn-default">重置</button>
                    </div>
                </div>
                <div class="mapTitle" style="display: none">
                    <span class="on" data-index="1">话务量排行</span>
                    <span data-index="0">诉求量排行</span>
                </div>
                <!--圆-->
                <div class="robin_circle" style="display: none">
                    <div class="r_out out_first">
                        <div class="r_in">
                            <div class="r_c c0"></div>
                            <div class="r_num" id="numAll"></div>
                        </div>
                        <p>话务总量</p>
                    </div>
                </div>
                <!--柱形图-->
                <div id="barCharts" style="height:500px;" class="charts"></div>
                <!--表格-->
                <div class="table_box" style="display: none">
                    <div class="table_tools">业务数据 <span class="downIcon" title="导出业务数据" id="export"></span></div>
                    <table id="myTable"></table>
                </div>
                <div id="initTip" style="text-align:center;">
                    <p>亲，请选择必选条件哦！</p>
                </div>
            </li>
            <li class="trend_box">
                <!--全局功能按钮-->
                <div class="tools_bar">
                    <div class="pull-left">
                        <a href="#" class="btn btn-default active" id="btnSearchLine" title="隐藏查询条"><i class="fa fa-filter"></i> 隐藏</a>
                        <a href="#" class="btn btn-default active" id="refreshLine"><i class="fa fa-refresh"></i> 刷新</a>
                    </div>
                </div>
                <!--查询条-->
                <div class="search on" id="searchBoxLine">
                    <div class="search_group">
                        <label class="control-label"><span class="respan">*</span>日期：</label>
                        <div class="control-inline">
                            <input placeholder="开始日期" class="form-control layer-date search_input" id="callStartTimeLine" autocomplete="off"> -
                            <input placeholder="结束日期" class="form-control layer-date search_input" id="callEndTimeLine" autocomplete="off">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label"><span class="respan">*</span>省市：</label>
                        <div class="control-inline" style="position: relative;">
                            <input id="cityLine" class="form-control city" readonly type="text" value="" autocomplete="off">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">场景：</label>
                        <div class="control-inline">
                            <input type="text" id="workNameNew" value="" class="form-control search_input" autocomplete="off">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">满意度：</label>
                        <div class="control-inline">
                            <select type="text" id="agreeLine" value="" class="form-control search_input agree"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">重复来电：</label>
                        <div class="control-inline">
                            <select type="text" id="repeatPhoneLine" value="" class="form-control search_input repeatPhone"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">客户星级：</label>
                        <div class="control-inline">
                            <select type="text" id="customerLevelLine"  class="form-control search_input selectpicker" title="请选择"></select>
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">话务小结：</label>
                        <div class="control-inline">
                            <input type="text" id="tagTrafficSearchLine0" value="" class="form-control search_input tagName" autocomplete="off"  data-type="0" data-typeC="SearchLine">
                        </div>
                    </div>
                    <div class="search_group">
                        <label class="control-label">系统标签：</label>
                        <div class="control-inline">
                            <input type="text" id="tagTrafficSearchLine1" value="" class="form-control search_input tagName" autocomplete="off" data-type="1" data-typeC="SearchLine">
                        </div>
                    </div>
                    <div class="search_group">
                        <button id="searchLine" class="btn  btn-primary">查询</button>
                        <button id="resetLine" class="btn  btn-default">重置</button>
                    </div>
                </div>
                <div class="mapTitle" style="display: none">
                    <span class="on" data-index="1">话务量排行</span>
                    <span data-index="0">诉求量排行</span>
                </div>
                <!--折线图-->
                <div id="lineCharts" style="height:500px;" class="charts"></div>
                <!--表格-->
                <div class="table_box" style="display: none">
                    <div class="table_tools">业务数据 <span class="downIcon" title="导出业务数据" id="exportLine"></span></div>
                    <table id="myTableLine"></table>
                </div>
                <div id="initTip" style="text-align:center;">
                    <p>亲，请选择必选条件哦！</p>
                </div>
            </li>
        </ul>
    </div>
</div>
<!--导出-->
<form action="" id="exportForm" class="hidden" method="post">
    <input type="text" id="callStartTimeE" name="callStartTime">
    <input type="text" id="callEndTimeE" name="callEndTime">
    <input type="text" id="provinceE" name="province">
    <input type="text" id="provinceCodeE" name="provinceCode">
    <input type="text" id="customerLocE" name="customerLoc">
    <input type="text" id="satisfactionE" name="satisfaction">
    <input type="text" id="reCallFlagE" name="recallFlag">
    <input type="text" id="customerLevelE" name="customerLevel">
    <input type="text" id="sysTagIdsE" name="sysTagIds">
    <input type="text" id="sysOperatorE" name="sysOperator">
    <input type="text" id="telTagIdsE" name="telTagIds">
    <input type="text" id="telOperatorE" name="telOperator">
</form>
<form action="" id="formDetail" class="hidden" target="_blank">
    <input type="text" name="tagPro">
    <input type="text" name="tagProOnly">
    <input type="text" name="tagProName">
    <input type="text" name="tagProType">
    <input type="text" name="tagStartTime">
    <input type="text" name="tagEndTime">
    <input type="text" name="reCallFlag">
    <input type="text" name="satisfaction">
    <input type="text" name="customerLevels">
    <input type="text" name="tagSence">
    <input type="text" name="sysTagIds">
    <input type="text" name="sysTagNames">
    <input type="text" name="sysOperator">
    <input type="text" name="telTagIds">
    <input type="text" name="telTagNames">
    <input type="text" name="telOperator">
</form>
<input type="hidden" id="tagTreeId" value="" class="form-control search_input">
<input type="hidden" id="areaTreeId" value="" class="form-control search_input">
<input type="hidden" id="tagTreeType" value="" class="form-control search_input">
<input type="hidden" id="tagProperty" value="" class="form-control search_input">
<input type="hidden" id="workTreeId" value="" class="form-control search_input">
<input type="hidden" id="workAreaId" value="" class="form-control search_input">
<script src="../../../assert/js/jquery.js" th:src="@{/assert/js/jquery.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/echarts.min.js" th:src="@{/assert/js/echarts.min.js}"></script>
<script src="../../../assert/js/bootstrap.min.js" th:src="@{/assert/js/bootstrap.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/bootstrap-table.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/bootstrap-table.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/bootstrap-table-mobile.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/bootstrap-table-mobile.min.js}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<script src="../../../assert/js/bootstrap-select.js" th:src="@{/assert/js/bootstrap-select.js}"></script>
<script src="../../../assert/js/plugin/toastr/toastr.min.js"
        th:src="@{/assert/js/plugin/toastr/toastr.min.js}"></script>
<script src="../../../assert/js/base.js" th:src="@{/assert/js/base.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/jquery-ui.min.js" th:src="@{/assert/js/jquery-ui.min.js}"></script>
<script src="../../../assert/js/plugin/layer/laydate/laydate.js"
        th:src="@{/assert/js/plugin/layer/laydate/laydate.js}"></script>
<script src="../../../assert/js/changeTime.js" th:src="@{/assert/js/changeTime.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/jsTree/jstree.min.js"
        th:src="@{/assert/js/plugin/jsTree/jstree.min.js}"></script>
<script src="../../../assert/js/plugin/chosen/chosen.jquery.js"
        th:src="@{/assert/js/plugin/chosen/chosen.jquery.js}"></script>
<script src="../../../assert/js/contabs.min.js" th:src="@{/assert/js/contabs.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/common.js" th:src="@{/assert/js/common.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/citypicker/city-picker.js" th:src="@{/assert/js/plugin/citypicker/city-picker.js}"></script>
<script src="../../../assert/js/taskCommon.js" th:src="@{/assert/js/taskCommon.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script>
    //项目名称
    var basePath = $("#basePath").attr("href");
    var json = [];
    //    表格初始化
    var TableInit = function () {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function (json) {
            $('#myTable').bootstrapTable("destroy");
            $('#myTable').bootstrapTable({
                data:json,
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                   //是否显示分页（*）
                sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                sortable: true,                     //是否启用排序
                sortName: "callNum", //排序方式
                sortOrder: "desc",
                contentType: "application/x-www-form-urlencoded",
                strictSearch: true,
                showColumns: false,                  //是否显示所有的列
                showRefresh: false,                  //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
                showToggle: false,                    //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: false,
                cellStyle: {
                    css: {"background-color": "#fff"}
                },//是否显示父子表
                columns: [
                    {
                        align: "center",
                        halign: "center",
                        title: '序号',//标题  可不加
                        width: 60,
                        formatter: function (value, row, index) {
                            return (index + 1) + "";
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'keyScene',
                        title: '业务场景'
                    },
                    {
                        field: 'callNum',
                        title: '话务量',
                        align: "center",
                        halign: "center",
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'话务量');
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'callPerc',
                        title: '话务量占比'
                    }, {
                        align: "center",
                        halign: "center",
                        field: 'callHb',
                        title: '话务量环比'
                    },
                    {
                        field: 'sceneNum',
                        title: '诉求量',
                        align: "center",
                        halign: "center",
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'诉求量');
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'scenePerc',
                        title: '诉求量占比'
                    }, {
                        align: "center",
                        halign: "center",
                        field: 'sceneHb',
                        title: '诉求量环比'
                    }
                ],
                onLoadSuccess: function (data) {  //加载成功时执行
                    if (!data.rows || data.rows.length == 0) {
                        var src = basePath + "/assert/image/nodata.png";
                        $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                    }
                },
                onLoadError: function () {  //加载失败时执行
                    var src = basePath + "/assert/image/nodata.png";
                    $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                },
                formatLoadingMessage: function () {
                    return '<div class="loaded">' +
                        '<div class="loader">' +
                        '<div class="loader-inner line-scale-pulse-out">' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '<div>请稍等，数据正在加载中...</div>';
                }
            });
        };
        return oTableInit;
    };
    //    表格初始化
    var TableInitLine = function (json) {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function (json) {
            $('#myTableLine').bootstrapTable("destroy")
            $('#myTableLine').bootstrapTable({
                data: json,
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                   //是否显示分页（*）
                sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                sortable: true,                     //是否启用排序
                sortName: "createTime", //排序方式
                sortOrder: "desc",
                contentType: "application/x-www-form-urlencoded",
                strictSearch: true,
                showColumns: false,                  //是否显示所有的列
                showRefresh: false,                  //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
//                uniqueId: "serialNumber",                     //每一行的唯一标识，一般为主键列
                showToggle: false,                    //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: true,
                cellStyle: {
                    css: {"background-color": "#fff"}
                },//是否显示父子表
                columns: [
                    {
                        align: "center",
                        halign: "center",
                        title: '序号',//标题  可不加
                        width: 60,
                        formatter: function (value, row, index) {
                            return (index + 1) + "";
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'createTime',
                        title: '日期',
                        sortable: true
                    },
                    {
                        field: 'callCount',
                        title: '话务量',
                        align: "center",
                        halign: "center",
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'话务量');
                        }
                    },
                    {
                        field: 'callTotal',
                        title: '话务总量',
                        align: "center",
                        halign: "center",
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'话务总量');
                        }
                    },
                    {
                        field: 'appealCount',
                        title: '诉求总量',
                        align: "center",
                        halign: "center",
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'诉求总量');
                        }
                    }
                ],
                onLoadSuccess: function (data) {  //加载成功时执行
                    if (!data.rows || data.rows.length == 0) {
                        var src = basePath + "/assert/image/nodata.png";
                        $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                    }
                },
                onLoadError: function () {  //加载失败时执行
                    var src = basePath + "/assert/image/nodata.png";
                    $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                },
                formatLoadingMessage: function () {
                    return '<div class="loaded">' +
                        '<div class="loader">' +
                        '<div class="loader-inner line-scale-pulse-out">' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '<div>请稍等，数据正在加载中...</div>';
                },
                onExpandRow: function (index, row, $detail) {
                    //这一步就是相当于在当前点击列下新创建一个table
                    if(row.appeals.length>0){
                        for(var i=0;i<row.appeals.length;i++){
                            row.appeals[i].createTime = row.createTime
                        }
                    }
                    InitSubTable(index, row.appeals, $detail);
                }
            });
        };
        //初始化子表格(无线循环)
        InitSubTable = function (index, row, $detail) {
            var parentid = index;
            var cur_table = $detail.html('<table></table>').find('table');
            $(cur_table).bootstrapTable({
                data: row,
                queryParams: {strParentID: parentid},
                ajaxOptions: {strParentID: parentid},
                clickToSelect: true,
                uniqueId: "classification",
                sortable: true,                     //是否启用排序
                sortName: "callNum", //排序方式
                sortOrder: "desc",
                pageSize: 10,
                pageList: [10, 25],
                columns: [
                    {
                        field: 'classification',
                        title: '业务分类/场景'
                    },
                    {
                        field: 'appealNum',
                        title: '诉求量',
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'诉求量');
                        }
                    },
                    {
                        field: 'appealPerc',
                        title: '诉求量占比'
                    },
                    {
                        field: 'callNum',
                        title: '话务量',
                        formatter: function (value, row, index) {
                            return bs.jumpFormatter(value, JSON.stringify(row), parent.$('#isJumpBtn').length,'话务量');
                        }
                    },
                    {
                        field: 'callPerc',
                        title: '话务量占比'
                    }
                ],
                onLoadSuccess: function (data) {  //加载成功时执行

                },
                onLoadError: function () {  //加载失败时执行

                },
                formatLoadingMessage: function () {
                    return '<div class="loaded">' +
                        '<div class="loader">' +
                        '<div class="loader-inner line-scale-pulse-out">' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '<div>请稍等，数据正在加载中...</div>';
                }
            });
        };
        return oTableInit;
    };
    //    页面自适应
    var resize = {
        init: function () {
            resize.me();
            $(window).resize(function () {
                resize.me();

            })
        },
        me: function () {
            $('.charts').width($(window).width())
            bar.myChart.resize();
            line.myChart.resize();
        }
    };
    //    查询条初始化
    var tools = {
        tableData: [],//表格数据
        reCallFlagArr: [],//重复来电
        agreeArr: [],//满意度
        proArr: [],//省市
        customerLevelArr:[],
        init: function () {
            tools.selectProvince();
            tools.getCustomerLevel();
            tools.getReCallFlag();
            tools.getSatStatus();
            bs.dataTime("#callStartTime", "#callEndTime", "YYYY-MM-DD");
            bs.dataTime("#callStartTimeLine", "#callEndTimeLine", "YYYY-MM-DD");
            tools.tabSearch();
            tools.search('');
            tools.search('Line');
            tools.reset('');
            tools.reset('Line');
            tools.refresh('');
            tools.refresh('Line');
            tools.enterSearch('');
            tools.enterSearch('Line');
            tools.export();
            tools.export('Line');
            tools.getNowTime('');
            tools.getNowTime('Line');
            tools.tabTitle();
            tools.tabBox();
            bs.getProCity();
            var pro=$("#spanId",parent.document).attr("data-procode");
            $("a[data-code='"+pro+"']").click();
            $(".out_first .c0").animate({
                height: "100%"
            },1000);
            bs.tabProGetClassify($('.scene_box'),'2');//根据省份不同渲染不同的业务标签
            bs.tabProGetClassify($('.trend_box'),'2');//根据省份不同渲染不同的业务标签
            $("#myTable").on("click",".J_menuItem",function(){
                var row = JSON.parse($(this).attr('data-row'));
                var params = tools.jumpDetail(row);
                $(this).attr('href',basePath + "/rest/page/dataMiningAudioRetrieval?"+params);
            })
            $("#myTableLine").on("click",".J_menuItem",function(){
                var row = JSON.parse($(this).attr('data-row'));
                var params = tools.jumpDetailTrend(row,$(this).attr('data-code'));
                $(this).attr('href',basePath + "/rest/page/dataMiningAudioRetrieval?"+params);
            })
        },
        selectProvince: function () {
            tools.proArr =bs.getProvince();
        },
        getCustomerLevel: function () {
            tools.customerLevelArr= bs.getStatus("audio_customer_level");
            bs.selectBootStrap($("#customerLevel"), tools.customerLevelArr);
            bs.selectBootStrap($("#customerLevelLine"), tools.customerLevelArr);
        },
        getReCallFlag: function () {
            var dataArr = bs.getStatus("recall_flag");
            Object.assign(tools.reCallFlagArr, dataArr);//es6复制数组的方法
            bs.selectDown($(".repeatPhone"), tools.reCallFlagArr);
        },
        getSatStatus: function () {
            var dataArr = bs.getStatus("audio_satisfaction");
            Object.assign(tools.agreeArr, dataArr);//es6复制数组的方法
            bs.selectDown($(".agree"), tools.agreeArr);
        },
        changeState: function (value, arr) {
            var str = "";
            for (var i = 0; i < arr.length; i++) {
                if (value == arr[i].value) {
                    str = arr[i].name
                }
            }
            return str;
        },
        tabSearch: function () {
            var search = $(".search");
            $("#btnSearch").on("click", function () {
                if (search.hasClass("on")) {
                    search.slideUp();
                    search.removeClass("on");
                    $("#btnSearch").html('<i class="fa fa-filter"></i> 查询').attr("title", "显示查询条");
                } else {
                    search.slideDown();
                    search.addClass("on");
                    $("#btnSearch").html('<i class="fa fa-filter"></i> 隐藏').attr("title", "隐藏查询条");
                }

            });
        },
        search: function (code) {
            $("#search"+code).on("click", function () {
                if($("#callStartTime"+code).val()=="" || $("#callEndTime"+code).val()==""){
                    toastrCog.error("请选择日期！",2000);
                    return
                }
                if($("#city"+code).val()==""){
                    toastrCog.error("请选择省份！",2000);
                    return
                }
                var index;
                if(code == 'Line'){
                    index=$(".trend_box .mapTitle span.on").attr('data-index');
                    getData.isLoadTrendData(index);
                }else{
                    index=$(".scene_box .mapTitle span.on").attr('data-index');
                    getData.isLoadData(index);
                }

            })
        },
        reset: function (code) {
            $("#reset"+code).on("click", function () {
                bs.resetSearch($("#searchBox"+code), ["city"+code]);
                if($("#laydate_box").length>0){
                    bs.resetTimeElems("#callStartTime"+code,"#callEndTime"+code);
                }
                var proCode = $("#spanId", parent.document).attr("data-procode");
                if(code == 'Line'){
                    if(proCode == ''){
                        $("#city"+code).citypicker("reset");
                        $("#workAreaId").val('');
                        $("#workNameNew").val('').attr('title','');
                    }
                    $("#searchBoxLine .tagName").val("").attr({"data-id": "","title":"",'data-relation':'','data-tag-id':''});
                    getData.isLoadTrendData(1);//    获取数据
                }else{
                    if(proCode == ''){
                        $("#city"+code).citypicker("reset");
                    }
                    $("#searchBox .tagName").val("").attr({"data-id": "","title":"",'data-relation':'','data-tag-id':''});
                    getData.isLoadData(1);//    获取数据
                }

            })
        },
        resetSelect: function ($obj) {
            $obj.val("");
            $obj.trigger("chosen:updated");
        },
        refresh: function (code) {
            $("#refresh"+code).on("click", function () {
                $("#search"+code).click();
            })
        },
        enterSearch: function (code) {
            var elem = $('.scene_box');
            if(code == 'Line'){
                elem = $('.trend_box');
            }
            elem.on("keyup", function (e) {
                var code = e.charCode || e.keyCode;
                if (code == 13) {
                    //此处编写用户敲回车后的代码
                    $("#search"+code).click();
                }
            })
        },
        export: function (code) {
            $("#export"+code).on("click", function () {
                if (getData.dataAll.length == 0) {
                    toastrCog.error("没有可导出的数据哦！", 3000)
                    return;
                }
                var form = $("#exportForm");
                var proCode=$("#city"+code).attr("code").split("/")[0];
                var city=$("#city"+code).attr("code").split("/")[1];
                var pro=$("#city"+code).val().split("/")[0];
                $("#callStartTimeE").val($("#callStartTime"+code).val());
                $("#callEndTimeE").val($("#callEndTime"+code).val());
                $("#provinceE").val(pro);
                $("#provinceCodeE").val(proCode);
                $("#customerLocE").val(city);
                $("#satisfactionE").val($("#agree"+code).val());
                $("#reCallFlagE").val($("#repeatPhone"+code).val());
                $("#customerLevelE").val($("#customerLevel"+code).val());
                if(code == 'Line'){
                    $("#sysTagIdsE").val($("#tagTrafficSearchLine1").val());
                    $("#sysOperatorE").val($("#tagTrafficSearchLine1").attr("data-relation"));
                    $("#telTagIdsE").val($("#tagTrafficSearchLine0").val());
                    $("#telOperatorE").val($("#tagTrafficSearchLine0").attr("data-relation"));
                    form.append('<input type="text" id="classificationE" name="classification">');
                    form.find("#classificationE").val($("#workNameNew").val());
                    window.open(bs.getSysConfig("SJWJ_URL_PRE").value + '/exportExcel/keySceneTrendExport?' + form.serialize())
                }else{
                    $("#sysTagIdsE").val($("#tagTrafficSearch1").val());
                    $("#sysOperatorE").val($("#tagTrafficSearch1").attr("data-relation"));
                    $("#telTagIdsE").val($("#tagTrafficSearch0").val());
                    $("#telOperatorE").val($("#tagTrafficSearch0").attr("data-relation"));
                    form.find("#classificationE").remove();
                    window.open(bs.getSysConfig("SJWJ_URL_PRE").value + '/exportExcel/appealsKeySceneExport?' + form.serialize())
                }
            })
        },
        getNowTime: function (code) {
            var endTime = dateFormatUtil(new Date().getTime()).split(" ")[0];
            var str = endTime.split(" ")[0];
            var startTime = str.substr(0, str.length - 2) + "01";
            $("#callStartTime"+code).val(startTime);
            $("#callEndTime"+code).val(endTime);
            bs.allTimeElem["#callEndTime"+code].min = startTime;
            bs.allTimeElem["#callEndTime"+code].start =  startTime;
            bs.allTimeElem["#callStartTime"+code].max =  endTime;
        },
        tabTitle:function(){
            $(".mapTitle span").on("click",function(){
                $(this).addClass("on").siblings().removeClass("on");
                var index=$(this).attr('data-index');//如果index 是0就按诉求排行，是1就按话务排行
                if($(this).parents('li').hasClass('scene_box')){
                    getData.initSenceData(index);
                }else{
                    getData.initTrendData(index);
                }
            })
        },
        tabBox:function(){
            $(".tabs li").on("click",function(){
                var index = $(this).index();
                $(this).addClass("on").siblings().removeClass("on");
                $('ul.contents>li').eq(index).addClass("on").siblings().removeClass("on");
                if(index == 0){
                    tag.init($("#city"),'Search','0',$('#searchBox'))
                    getData.isLoadData($('.scene_box .mapTitle span.on').attr('data-index'));//    获取数据
                }else{
                    tag.init($("#cityLine"),'Search','0',$('#searchBoxLine'));
                    getData.isLoadTrendData($('.trend_box .mapTitle span.on').attr('data-index'));//    获取数据
                }
            })
        },
        jumpDetail:function(row){
            var form=$("#formDetail");
            var proCode = $("#city").attr("code").split("/")[0];
            var city = $("#city").attr("code").split("/")[1];
            var proCodeName = $("#city").val().split("/")[0];
            var cityName = $("#city").val().split("/")[1];
            var callStartTimeC = $("#callStartTime").val();
            var callEndTimeC = $("#callEndTime").val();
            var reCallFlagC = $("#repeatPhone").val();
            var satisfactionC = $("#agree").val();
            var customerLevelsC = $("#customerLevel").val();
            var proObj = JSON.stringify(proCity.formatter(proCode,[city]));
            var proName = '';
            if(cityName){
                proName = proCity.formatterName('',cityName);
            }else{
                proName = proCity.formatterName(proCodeName,cityName);
            }
            var telElem = $('#tagTrafficSearch0');
            var sysElem = $('#tagTrafficSearch1');
            if(proCode == 'CHINA'){
                proObj = '{}'
            }
            form.find("input[name='tagPro']").val(proObj);
            if(city){
                form.find("input[name='tagProOnly']").val('{}');
            }else{
                form.find("input[name='tagProOnly']").val(proObj);
            }
            form.find("input[name='tagProName']").val(proName);
            form.find("input[name='tagProType']").val('0');
            form.find("input[name='tagStartTime']").val(callStartTimeC);
            form.find("input[name='tagEndTime']").val(callEndTimeC);
            form.find("input[name='reCallFlag']").val(reCallFlagC);
            form.find("input[name='satisfaction']").val(satisfactionC);
            form.find("input[name='customerLevels']").val(customerLevelsC);
            form.find("input[name='telTagIds']").val(telElem.attr('data-id'));
            form.find("input[name='telTagNames']").val(telElem.val());
            form.find("input[name='telOperator']").val(telElem.attr('data-relation'));
            form.find("input[name='sysTagIds']").val(sysElem.attr('data-id'));
            form.find("input[name='sysTagNames']").val(sysElem.val());
            form.find("input[name='sysOperator']").val(sysElem.attr('data-relation'));
            form.find("input[name='tagSence']").val(row.keyScene);
            return form.serialize();
        },
        jumpDetailTrend:function(row,text){
            var form=$("#formDetail");
            var proCode = $("#cityLine").attr("code").split("/")[0];
            var city = $("#cityLine").attr("code").split("/")[1];
            var proCodeName = $("#cityLine").val().split("/")[0];
            var cityName = $("#cityLine").val().split("/")[1];
            var callStartTimeC = row.createTime+' '+'00:00:00';
            var callEndTimeC = row.createTime+' '+'23:59:59';
            var reCallFlagC = $("#repeatPhoneLine").val();
            var satisfactionC = $("#agreeLine").val();
            var customerLevelsC = $("#customerLevelLine").val();
            var classificationVal = $("#workNameNew").val();
            var proObj = JSON.stringify(proCity.formatter(proCode,city));
            var proName = proCity.formatterName(proCodeName,cityName);
            var telElem = $('#tagTrafficSearchLine0');
            var sysElem = $('#tagTrafficSearchLine1');
            if(proCode == 'CHINA'){
                proObj = '{}'
            }
            // 当业务分类没有选时 并且是父表格的话务量或者诉求总量时 将子表格的分类传到列表页
            if(classificationVal == '' && 'appeals' in row && (text == "话务量"|| text == "诉求总量")){
                var classification = '';
                row.appeals.forEach(function(data,index){
                    classification += data.classification + ','
                });
                classification = classification.substr(0,classification.length-1);
                classificationVal = classification;
            }
            if(text == "话务总量"){
                classificationVal = ''
            }
            if(!('appeals' in row) && (text == "话务量"|| text == "诉求量")){
                classificationVal = row.classification
            }
            form.find("input[name='tagPro']").val(proObj);
            form.find("input[name='tagProOnly']").val(proObj);
            form.find("input[name='tagProName']").val(proName);
            form.find("input[name='tagProType']").val('0');
            form.find("input[name='tagStartTime']").val(callStartTimeC);
            form.find("input[name='tagEndTime']").val(callEndTimeC);
            form.find("input[name='reCallFlag']").val(reCallFlagC);
            form.find("input[name='satisfaction']").val(satisfactionC);
            form.find("input[name='customerLevels']").val(customerLevelsC);
            form.find("input[name='telTagIds']").val(telElem.attr('data-id'));
            form.find("input[name='telTagNames']").val(telElem.val());
            form.find("input[name='telOperator']").val(telElem.attr('data-relation'));
            form.find("input[name='sysTagIds']").val(sysElem.attr('data-id'));
            form.find("input[name='sysTagNames']").val(sysElem.val());
            form.find("input[name='sysOperator']").val(sysElem.attr('data-relation'));
            form.find("input[name='tagSence']").val(classificationVal);
            if(text == "话务总量"){
                form.find("input[name='tagSence']").val('');
            }
            return form.serialize();
        }

    };
    //    柱形统计图初始化
    var bar = {
        chart: null,
        data: null,
        dataList: null,
        valueList: null,
        option: {
            title: {
                text: ""
            },
            color: ['#3398DB'],
            backgroundColor:"#fff",
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                },
                formatter: function (params) {
                    var name = params[0].name;
                    var data = params[0].value;
                    var hb = params[0].data.hb;
                    var zb = params[0].data.zb;
                    var str=name+"<br><span class='dot c1'></span>诉求量:"+data+"<br>";
                    if(zb){
                        str+="<span class='dot c3'></span>诉求量占比:"+zb+"<br>";
                    }
                    if(hb){
                        str+="<span class='dot c4'></span>诉求量环比:"+hb;
                    }
                    return str;
                }
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'value'
                }
            ],
            yAxis: [
                {
                    type: 'category',
                    axisLine: {onZero: false},
                    data : [],
                    axisTick: {
                        alignWithLabel: true
                    }
                }

            ],
            series: [
                {
                    name: '直接访问',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 1, 1,
                                [
                                    {offset: 0, color: '#83bff6'},
                                    {offset: 0.5, color: '#188df0'},
                                    {offset: 1, color: '#188df0'}
                                ]
                            )
                        }
                    },
                    label: {
                        show: true,
                        position: 'right',
                        formatter: function (params) {
                            return params.value;
                        },
                        color: "#000"
                    }
                    ,
                    barWidth: '60%',
                    data: []
                }
            ]
        },
        init: function () {
            bar.myChart = echarts.init(document.getElementById('barCharts'));
            bar.myChart.setOption(bar.option);
            bar.myChart.showLoading();
            // 点击条形图下钻
            bar.myChart.on('click', function (params) {
                bar.nextScene(params.data.name);
            });
            // 点击圆
            $(".robin_circle").on("click",".can_click",function(){
                var servicePath=$(this).attr("data-servicePath");
                bar.nextScene(servicePath);
            });
        },
        nextScene:function(servicePath){
            $("#servicePathE").val(servicePath);
            $('#cityLine').val($('#city').val()).attr('code',$('#city').attr('code'));
            $('#callStartTimeLine').val($('#callStartTime').val());
            $('#callEndTimeLine').val($('#callEndTime').val());
            $("#cityLine").parent().find("a[data-code='"+$('#city').attr('code').split("/")[0]+"']").click();
            $("#cityLine").parent().find("a[data-code='"+$('#city').attr('code').split("/")[1]+"']").click();
            $('#workNameNew').val(servicePath).attr('title',servicePath);
            $("#agreeLine").val($("#agree").val()).trigger("chosen:updated");
            $("#repeatPhoneLine").val($("#repeatPhone").val()).trigger("chosen:updated");
            $("#customerLevelLine").selectpicker('val',$("#customerLevel").val());
            var lineTagElem0 = $('#tagTrafficSearchLine0');
            var tagElem0 = $('#tagTrafficSearch0');
            var lineTagElem1 = $('#tagTrafficSearchLine1');
            var tagElem1 = $('#tagTrafficSearch1');
            lineTagElem0.val(tagElem0.val())
                        .attr('data-id',tagElem0.attr('data-id'))
                        .attr('data-relation',tagElem0.attr('data-relation'))
                        .attr('title',tagElem0.val());
            lineTagElem1.val(tagElem1.val())
                .attr('data-id',tagElem1.attr('data-id'))
                .attr('data-relation',tagElem1.attr('data-relation'))
                .attr('title',tagElem1.val());
            $(".tabs li").eq(1).click();
        },
        renderOption: function (codeType) {
            var dataAll=getData.dataAll;
            var yArr=[];
            var xArr=[];
            if(dataAll.length>0){
                for(var i=0;i<dataAll.length;i++){
                    var keyScene=dataAll[i].keyScene;
                    var callNum=dataAll[i].callNum;
                    var sceneNum=dataAll[i].sceneNum;
                    var callHb=dataAll[i].callHb;
                    var sceneHb=dataAll[i].sceneHb;
                    var callPerc=dataAll[i].callPerc;
                    var scenePerc=dataAll[i].scenePerc;
                    var obj={};
                    obj.name=keyScene;
                    if(codeType==0){
                        obj.value=sceneNum;
                        obj.hb=sceneHb;
                        obj.zb=scenePerc;
                    }else{
                        obj.value=callNum;
                        obj.hb=callHb;
                        obj.zb=callPerc;
                    }

                    xArr.push(obj);
                    yArr.push(keyScene);
                }
            }
            bar.option.yAxis[0].data=yArr;
            if(yArr.length<10){
                bar.option.dataZoom=[{
                    show: false,
                    realtime: true
                }]
            }else {
                bar.renderdataZoom();
            }
            bar.option.series[0].data=xArr;
            bar.option.tooltip.formatter=function(params) {
                var typeName="";
                if(codeType==0){
                    typeName="诉求量"
                }else{
                    typeName="话务量"
                }
                var name = params[0].name;
                var data = params[0].value;
                var hb = params[0].data.hb;
                var zb = params[0].data.zb;
                var str=name+"<br><span class='dot c1'></span>"+typeName+":"+data+"<br>";
                if(zb){
                    str+="<span class='dot c3'></span>"+typeName+"占比:"+zb+"<br>";
                }
                if(hb){
                    str+="<span class='dot c4'></span>"+typeName+"环比:"+hb;
                }
                return str;
            };
            //            导出图片的名字
            if(codeType==0){
                bar.option.toolbox.feature.saveAsImage.name="重点关注场景场景排行诉求量";
            }else{
                bar.option.toolbox.feature.saveAsImage.name="重点关注场景趋势分析话务量";
            }
            bar.myChart.setOption(bar.option);
        },
        renderdataZoom:function(){
            bar.option.dataZoom=[ {
                type: 'slider',
                yAxisIndex: 0,
                filterMode: 'empty',
                minSpan:20
            }]
        }
    };
    //    折线统计图初始化
    var line = {
        chart: null,
        data: null,
        dataList: null,
        valueList: null,
        option: {
            title: {
                text: ''
            },
            tooltip: {
                trigger: 'axis',
                showContent: true
            },
            legend: {
                type:'scroll',
                left: 50,
                right: 50,
                data: []
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '10%',
                containLabel: true,
                height: '75%'
            },
            toolbox: {
                feature: {
                    saveAsImage: {
                        name:""
                    }
                }
            },
            dataZoom: [],
            dataset: {
                source: []
            },
            xAxis: [
                {
                    type: 'category',
//                    boundaryGap : false,
//                    axisLine: {onZero: false},
//                    data : []
                }
            ],
            yAxis: {
                type: 'value'
            },
            series: []
        },
        init: function () {
            line.myChart = echarts.init(document.getElementById('lineCharts'));
            line.myChart.setOption(line.option);
            line.myChart.showLoading();
        },
        renderOption: function (codeType) {
            var start = new Date($("#callStartTimeLine").val()).getTime();
            var end = new Date($("#callEndTime").val()).getTime();
            var timeArr = [$("#callStartTime").val()];
            var num = (end - start) / 24 / 3600 / 1000;
            for (var i = 0; i < num; i++) {
                start += 24 * 3600 * 1000;
                timeArr.push(dateFormatUtil(start).split(" ")[0]);
            }
            var dataAll = getData.dataAll;
            var seriesM = [];
            var legend = [];
            var source = [];
            var timeAndNumArr=[];
            var tableData=getData.tableData;
            var all=[];
            for(var i=0;i<tableData.length;i++){//获取总诉求 总话务量的数据。
                var objAll={};
                objAll.createTime=tableData[i].createTime;
                objAll.appealNum=tableData[i].appealCount;
                objAll.callNum=tableData[i].callCount;
                all.push(objAll);
            }
            if (dataAll.length > 0) {
                var dataAllObj={};
                if(codeType==0){
                    dataAllObj.classification="总诉求量";
                }else{
                    dataAllObj.classification="话务量";
                }
                dataAllObj.timeAndNum=all;
                dataAll.push(dataAllObj);
                for (var i = 0; i < dataAll.length; i++) {
                    var obj = {};
                    var classification = dataAll[i].classification;
                    var timeAndNum = dataAll[i].timeAndNum;
                    obj.name = classification;
                    obj.type = 'line';
                    obj.seriesLayoutBy = 'row';
                    seriesM.push(obj);
                    legend.push(classification);
                    for(var j=0;j<timeAndNum.length;j++){
                        timeAndNum[j].classification=classification;
                    }
                    timeAndNumArr.push(timeAndNum);
                }
            }
            for(var j=0;j<timeAndNumArr.length;j++){
                var data = timeAndNumArr[j];
                var arrTime=[];
                if (timeArr.length > 0) {
                    for (var i = 0; i < timeArr.length; i++) {
                        arrTime.push(0);
                        if(arrTime.indexOf(data[0].classification)==-1){
                            arrTime.unshift(data[0].classification);
                        }
                    }
                    for (var n = 0; n < timeArr.length; n++) {
                        var timeStr = timeArr[n];
                        for (var m = 0; m < data.length; m++) {
                            var name = data[m].createTime;
                            var appealNum = data[m].appealNum;
                            var callNum = data[m].callNum;
                            var val="";
                            if (codeType == 0) {
                                val = appealNum;
                            } else {
                                val= callNum;
                            }
                            if(name==timeStr){
                                arrTime[n+1]=val
                            }
                        }
                    }
                }
                source.push(arrTime);
            }

            var x = 0;
            var y = 100;
            if (timeArr.length < 10) {
                line.option.dataZoom = [{
                    show: false,
                    realtime: true,
                }]
            } else {
                x = 0;
                y = 60;
                line.renderdataZoom(x, y);
            }
            line.option.legend.data = legend;
            timeArr.unshift("product");
            source.unshift(timeArr);
            line.option.series = seriesM;
            line.option.dataset.source = source;
//            导出图片的名字
            if(codeType==0){
                line.option.toolbox.feature.saveAsImage.name="重点关注场景趋势分析诉求量";
            }else{
                line.option.toolbox.feature.saveAsImage.name="重点关注场景趋势分析话务量";
            }
            line.myChart.setOption(line.option);
        },
        renderdataZoom: function (start, end) {
            line.option.dataZoom = [{
                show: true,
                realtime: true,
                start: start,
                end: end
            },
                {
                    type: 'inside',
                    realtime: true,
                    start: start,
                    end: end
                }];
        }
    };
    //    获取数据
    var getData={
        dataAll:null,
        tableData:null,
        initTrendData:function(codeType){
            line.myChart.showLoading();
            var proCode = $("#cityLine").attr("code").split("/")[0];
            var city = $("#cityLine").attr("code").split("/")[1];
            var pro = $("#cityLine").val().split("/")[0];
            var params = {
                callStartTime: $("#callStartTimeLine").val(),//语音开始的日期
                callEndTime: $("#callEndTimeLine").val(),//语音结束的日期
                province: pro,//省份
                provinceCode: proCode,//省份的编码
                customerLoc: city,//市
                classification: $("#workNameNew").val(),//具体的业务场景
                satisfaction: $("#agreeLine").val(),//该通通话客户之满意度
                recallFlag: $("#repeatPhoneLine").val(),//该通通话是否是重复来电
                customerLevel: $("#customerLevelLine").val(),
                sysTagIds: $("#tagTrafficSearchLine1").val(),
                sysOperator: $("#tagTrafficSearchLine1").attr('data-relation'),
                telTagIds: $("#tagTrafficSearchLine0").val(),
                telOperator: $("#tagTrafficSearchLine0").attr('data-relation')
            };
            $.ajax({
                type: "POST",
                url: bs.getSysConfig("SJWJ_URL_PRE").value + '/dataMining/keySceneTrendAnalysis',
                dataType: "json",
                contentType: 'application/json',
                data: JSON.stringify(params),
                success: function (data) {
                    var code = data.rtnCode;
                    if (code == 0) {
                        var result = data.data;
                        getData.tableData=result;
                        var oTableLine = new TableInitLine();
                        oTableLine.Init(result);
                        $.ajax({
                            type: "POST",
                            url: bs.getSysConfig("SJWJ_URL_PRE").value + '/dataMining/keySceneTrendChartAnalysis',
                            dataType: "json",
                            contentType: 'application/json',
                            data: JSON.stringify(params),
                            success: function (data) {
                                var code = data.rtnCode;
                                if (code == 0) {
                                    line.myChart.clear();
                                    line.myChart.hideLoading();
                                    var result = data.data;
                                    getData.dataAll = result;
                                    $('#lineCharts').removeAttr('_echarts_instance_');
                                    line.renderOption(codeType);
                                }
                            }
                        });
                    }
                }
            });
        },
        initSenceData:function(codeType){
            bar.myChart.showLoading();
            var proCode=$("#city").attr("code").split("/")[0];
            var city=$("#city").attr("code").split("/")[1];
            var pro=$("#city").val().split("/")[0];
            var params={
                callStartTime:$("#callStartTime").val(),//语音开始的日期
                callEndTime:$("#callEndTime").val(),//语音结束的日期
                province:pro,//省份
                provinceCode:proCode,//省份的编码
                customerLoc:city,//市
                satisfaction:$("#agree").val(),//该通通话客户之满意度
                recallFlag:$("#repeatPhone").val(),//该通通话是否是重复来电
                customerLevel: $("#customerLevel").val(),
                sysTagIds: $("#tagTrafficSearch1").val(),
                sysOperator: $("#tagTrafficSearch1").attr('data-relation'),
                telTagIds: $("#tagTrafficSearch0").val(),
                telOperator: $("#tagTrafficSearch0").attr('data-relation')
            };
            $.ajax({
                type: "POST",
                url: bs.getSysConfig("SJWJ_URL_PRE").value+'/dataMining/appealsKeySceneAnalysis',
                dataType: "json",
                contentType: 'application/json',
                data:JSON.stringify(params),
                success: function (data) {
                    bar.myChart.hideLoading();
                    var result=data.data.keyScenes;
                    var callTotal=data.data.callTotal;
                    var appealCount=data.data.appealCount;
                    var callCount=data.data.callCount;
                    if(!appealCount){
                        appealCount=0;
                    }
                    var code=data.rtnCode;
                    if (code ==0) {
                        getData.dataAll=bs.objArrDeepCopy(result);
                        var oTable = new TableInit();
                        oTable.Init(result);
                        var numAll = codeType==0?appealCount:callCount;
                        $(".robin_circle .r_out").not(".out_first").remove();
                        if(result.length>0){
                            if(codeType==0){
                                getData.dataAll.sort(bs.sortBy("sceneNum"));
                            }else{
                                getData.dataAll.sort(bs.sortBy("callNum"));
                            }
                            for(var i=0;i<getData.dataAll.length;i++){
                                getData.renderYuan(getData.dataAll[i],i+1,codeType,numAll,callTotal);
                            }
                        }else{
                            if(codeType==1){
                                $(".out_first").find("p").html("话务量");
                            }else{
                                $(".out_first").find("p").html("总诉求量");
                            }
                            $("#numAll").html(0);
                        }
                        $('#barCharts').removeAttr('_echarts_instance_');
                        bar.renderOption(codeType);
                    }
                }
            });
        },
        renderYuan:function(data,i,codeType,numAll,callTotal){
            var perc=data.scenePerc;
            var name=data.keyScene;
            if(codeType==1){
                perc=data.callPerc;
                $(".out_first").find("p").html("话务量");
                if($(".robin_circle").find(".out_sec").length==0){
                    $(".robin_circle").prepend('<div class="r_out out_sec">' +
                        '<div class="r_in">' +
                        '<div class="r_c c0"></div>' +
                        '<div class="r_num">'+callTotal+'</div>' +
                        '</div>' +
                        '<p>话务总量</p>' +
                        '</div>');
                }
            }else{
                $(".out_first").find("p").html("总诉求量");
            }
            $("#numAll").html(numAll);
            var $div=$('<div class="r_out can_click" data-servicePath="'+name+'">' +
                '<div class="r_in">' +
                '<div class="r_c c'+(i%5)+'"></div>' +
                '<div class="r_num">'+perc+'</div>' +
                '</div>' +
                '<p title="'+name+'">'+name+'</p>' +
                '</div>');
            $(".robin_circle").append($div);
            $div.find(".r_c").animate({
                height:perc
            },1000);
            $(".out_first,.out_sec").find(".r_c").animate({
                height:"100%"
            },1000);
        },
        isLoadData:function(codeType){
            if($("#callStartTime").val()!="" && $("#city").val()!=""){
                $("#barCharts").show();
                $(".robin_circle").show();
                $(".table_box").show();
                $(".mapTitle").show();
                $(".scene_box #initTip").hide();
                getData.initSenceData(codeType);//    获取数据
            }else{
                $("#barCharts").hide();
                $(".table_box").hide();
                $(".robin_circle").hide();
                $(".mapTitle").hide();
                $(".scene_box #initTip").show();
            }
        },
        isLoadTrendData:function(codeType){
            if($("#callStartTimeLine").val()!="" && $("#cityLine").val()!=""){
                $("#lineCharts").show();
                $(".table_box").show();
                $(".mapTitle").show();
                $(".trend_box #initTip").hide();
                getData.initTrendData(codeType);//    获取数据
            }else{
                $("#lineCharts").hide();
                $(".table_box").hide();
                $(".mapTitle").hide();
                $(".trend_box #initTip").show();
            }
        }

    };
    $(function () {
        tools.init();//    查询条初始化
        bar.init();//    柱形统计图初始化
        line.init();//    柱形统计图初始化
        var oTable = new TableInit();//    表格初始化
        oTable.Init([]);
        var oTableLine = new TableInitLine();//    表格初始化
        oTableLine.Init([]);
        resize.init();//    页面自适应
        getData.isLoadData(1);//    获取数据
        getData.isLoadTrendData(1);//    获取数据
        var proCode = $("#cityLine").attr("code").split("/")[0];
        menuWorkNew.init(proCode,$('#jstree'),'2');//    获取业务数据
        workNew.init(proCode,$('#jstree'));
        $("#workAreaId").val(proCode);
        tag.init($("#city"),'Search','0',$('#searchBox'));
    })
</script>
</body>
</html>